<template>
  <el-dialog
    :title="!dataForm.id ? '新增' : '修改'"
    :close-on-click-modal="false"
    append-to-body
    :visible.sync="visible" width="800px">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
             label-width="120px">
      <el-form-item label="分组名称" prop="jgFzName">
        <el-input v-model="dataForm.jgFzName" placeholder="请输入分组名称" style="width:90%;"></el-input>
      </el-form-item>

      <el-form-item label="分组系数" prop="fzXs">
        <el-input-number v-model="dataForm.fzXs" :precision="2" :step="0.01" :max="500" :min="0" placeholder="请输入分组系数" style="width:90%;"></el-input-number>
      </el-form-item>

      <el-form-item label="分组说明" prop="jgFzSm">
        <el-input type="textarea" :rows="4" v-model="dataForm.jgFzSm" placeholder="请输入分组说明" maxlength="300"
                  show-word-limit style="width:90%;"></el-input>
      </el-form-item>


    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="dataFormSubmit()" v-if="canSubmit">确定</el-button>
      <el-button type="primary" plain @click="visible = false">取消</el-button>
    </span>
  </el-dialog>
</template>

<script>
/*!
 * 绩效考核-人员分组维护子页面-增加、修改分组
 *
 * @author zmk
 * @date 2021-08-03 10:11:35
 */
import {getObj, addObj, putObj} from '@/api/jiangjin/jiangjinjjjgfz'

export default {
  data() {
    return {
      visible: false,
      canSubmit: false,
      dataForm: {
        id: 0,
        jgFzName: '',
        jgFzSm: '',
        zjDeptId: 0,
        zjDeptName: '',
        deptId: 0,
        fzXs: '',
      },
      dataRule: {
        jgFzName: [
          {required: true, message: '分组名称不能为空', trigger: 'blur'},
          {min: 0, max: 50, message: '长度需在 50 个字符以内', trigger: 'blur'}
        ],
        fzXs: [
          {required: true, message: '分组系数不能为空', trigger: 'blur'},
        ],
      }
    }
  },
  methods: {
    csh() {
      this.dataForm = {
        id: 0,
        jgFzName: '',
        jgFzSm: '',
        zjDeptId: 0,
        zjDeptName: '',
        deptId: 0,
        fzXs: '',
      };
    },
    init(deptId, deptName, id) {
      this.csh();
      this.dataForm.id = id || 0;
      this.dataForm.zjDeptId = deptId;
      this.dataForm.zjDeptName = deptName;
      this.dataForm.deptId = deptId;
      this.visible = true;
      this.canSubmit = true;
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields()
        if (this.dataForm.id) {
          getObj(this.dataForm.id).then(response => {
            this.dataForm = response.data.data
          })
        }
      })
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          this.canSubmit = false;
          if (this.dataForm.id) {
            putObj(this.dataForm).then(data => {
              this.$notify.closeAll();
              this.$notify.success('修改成功')
              this.visible = false
              this.$emit('refreshDataList')
            }).catch(() => {
              this.canSubmit = true;
            });
          } else {
            addObj(this.dataForm).then(data => {
              this.$notify.closeAll();
              this.$notify.success('添加成功')
              this.visible = false
              this.$emit('refreshDataList')
            }).catch(() => {
              this.canSubmit = true;
            });
          }
        }
      })
    }
  }
}
</script>

